<template>
    <div style="text-align: center;background-color: #eaecf0;margin-top: 46px;margin-bottom: 60px">
        <van-nav-bar fixed="true" title="在线律师">
            <template #right>
                <van-icon name="search" size="18"/>
            </template>
        </van-nav-bar>
        <van-notice-bar text="一分钟前：用户【1882901****】咨询了律师【111】" left-icon="volume-o">
            一分钟前：用户【1882901****】咨询了律师【王律师】
        </van-notice-bar>
        <div :key="item" v-for="item in lawyerLists" style="padding-bottom: 5px;background-color: #eaecf0">
            <van-grid :gutter="10" column-num="1" icon-size="78px" style="margin-top: 10px;background-color: #eaecf0"
                      clickable true>
                <van-grid-item>
<!--                    暂时用图标代替，可用下面方法从数据库读取-->
                    <van-cell style="justify-content: left"><van-icon name="contact" /></van-cell>
<!--                    此处从数据库读取图片位置，可设置网络图片，也可以在注册界面添加上传图片选项进行上传-->
<!--                    <van-cell><img width="50%" :src="item.lawImage"></van-cell>-->
                    <van-cell>律师：{{item.lawLawyerName}}</van-cell>
                    <van-cell>领域：{{item.lawLawyerKind}}
                        <van-button @click="toChat(item.id)" style="float: right" type="primary" size="small">咨询</van-button>
                    </van-cell>
                </van-grid-item>
            </van-grid>
        </div>
    </div>
</template>

<script>
    export default {
        name: "lawyerList",
        data() {
            return {
                lawyerLists: []
            }
        },
        methods: {
            lawyerList() {
                this.$axios.post('/lawyer/getLawyerList',
                    {}, res => {
                        console.log(res)
                        this.lawyerLists = res.data.data
                    })
            },
            toChat(id) {
                this.$router.push({path:'chat',query:{id:id}})
            }
        },
        created() {
            this.lawyerList()
        }
    }
</script>


<style scoped>

</style>
